<template>
  <div class="home">
    <!-- 插槽可以插入标签 -->
    <input type="text" v-model="msg">
    <p>{{msg}}</p>
     <my-table :tableData="list">
        <!-- <span slot="left">返回</span> -->
       <!-- <template >
        
       </template> -->
       <!-- <template slot="right">
          <span>编辑</span>
       </template> -->
       <!-- 当没有名字的时候，我们 使用 default(默认值) 代替name -->
       <template #default="{i,row}">
         <button @click="del(i,row)">删除</button>
       </template>
     </my-table>
  </div>
</template>

<script>
// @ is an alias to /src
import myTable from '../components/myTable.vue'
export default {
  name: 'HomeView',
  components: {
    myTable
  },
  data(){
    return {
      list:[
        {name:"鲁班",class: '2109C',hobby:"学习",age: 180},
        {name:"妲己",class: '2109C',hobby:"走猫步",age: 100},
        {name:"赵云",class: '2109C',hobby:"就刘禅",age: 120},
        {name:"刘备",class: '2109C',hobby:"打曹操",age: 90},
        {name:"诸葛亮",class: '2109C',hobby:"人生如棋",age: 100}
      ],
      msg:''
    }
  },
  methods: {
    del(val,val1){
      // console.log(val1);
      // console.log(val);
      this.list.splice(val,1)
    }
  },
}
</script>
